/**
 * p3c问题详情弹窗
 */

import React from 'react';
import { Button, Dialog } from '@teamix/ui';
import intl from '../../../../../../../../../../../locale';

export default class P3cDetailDialog extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isDialogVisible: false,
    };
  }

  onDialogOpen = () => {
    const { rule } = this.props;
    this.props.getP3cDetail(rule.rule_id, () => {
      this.setState({ isDialogVisible: true });
    });
  };

  onDialogOk = () => {};

  onDialogCancel = () => {
    this.setState({ isDialogVisible: false });
  };

  render() {
    const { rule, p3cRuleDetail } = this.props;

    return (
      <div>
        <Button shape="text" onClick={this.onDialogOpen}>
          {intl.get({
            id: 'code-assets.src.utils.locale.Details',
            defaultMessage: '详情',
          })}
        </Button>
        <Dialog
          visible={this.state.isDialogVisible}
          footer={false}
          onClose={this.onDialogCancel}
          title={
            <span>
              {rule.cn_ruleset_name}：{rule.violation_message}
            </span>
          }
        >
          {p3cRuleDetail && <div dangerouslySetInnerHTML={{ __html: p3cRuleDetail.description }} />}
        </Dialog>
      </div>
    );
  }
}
